<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>Elements Test</title>
  <script type="text/javascript"><!--
    function $(id) {
      return document.getElementById(id);
    }
    function set_style() {
      var id = $("s_id").value;
      var style = $("s_style").value;
      var value = $("s_value").value;
      $(id).style[style] = value;
    }
  //--></script>
</head>
<body>
  <h1>Elements Test</h1>
  <hr>
  <form id="form" name="form" action="form_posted.html" method="POST">
    <ul>
      <li><input id="button1" name="button1" type="button" value="Button1"></li>
      <li id="li2"><button id="button2" name="button2" value="Button2">Button2</button></li>
      <li><input id="field1" name="field1" type="text" value="field1"></li>
      <li><input id="field2" name="field2" type="text" value="field2" disabled></li>
      <li><input id="checkbox1" name="checkbox1" type="checkbox" value="checkbox1"><label for="checkbox1">CheckBox1</label></li>
      <li><input id="checkbox2" name="checkbox2" type="checkbox" value="checkbox2"><label for="checkbox2">CheckBox2</label></li>
      <li><a id="link1" href="/form.html">Link1</a></li>
      <li><a id="link2" href="/form2.html">Link2</a></li>
      <li><select id="select1" name="select1">
          <option value="OK">OK</option>
          <option value="NG">NG</option>
      </select></li>
      <li><table id="table1" border="1"><tr><th>Cell11</th><th>Cell12</th></tr><tr><td>Cell21</td><td>Cell22</td></tr></table></li>
    </ul>
  </form>
  <ul>
    <li>ID: <input id="s_id"></li>
    <li>Style: <input id="s_style"></li>
    <li>Value: <input id="s_value"></li>
    <li><input id="s_set" type="button" value="Set Style" onclick="set_style()"></li>
  </ul>
</body>
</html>
